<html>

<head>
<title>StrinGLE: String'n'Glue Learning Environment</title>

<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.2.0/build/reset/reset-min.css"> 
<link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/2.2.0/build/fonts/fonts-min.css"> 

<link type="text/css" rel="stylesheet"  href="http://blogs.open.ac.uk/Maths/ajh59/tabber.css" />

<link rel="stylesheet" type="text/css" href="stringle2.css" />

<?php if ($_GET['css']) echo "<link rel='stylesheet' type='text/css' href='".$_GET['css']."' />";?>

<script type="text/javascript" src="http://blogs.open.ac.uk/Maths/ajh59/tabber.js"></script>
<script type="text/javascript">

function configure(){var c=document.getElementById('config');c.setAttribute('style','display:block');}
function hideConfig(){var c=document.getElementById('config');c.setAttribute('style','display:none');}

function setLink(url){
 var a=document.getElementById('stringleLink');
 a.setAttribute('href', url);
}

function setToolURL(url){
 document.getElementById('toolsFrame').setAttribute('src',url);
}

function setWebURL(){
 var url=document.getElementById('webURL').value;
 document.getElementById('ousefulOL').setAttribute('src',url);
 add2Delicious(url);
 document.getElementById('setPageURL').value=url;
}

function setWebURLlocation(){
 var url='http://ouseful.open.ac.uk/stringle2.php?';
 var tools=document.getElementById('setDeliToolsId').value;
 if (tools!='') url+='t='+tools;
 var page=document.getElementById('setPageURL').value;
 if (page!='') url+='&s='+page;
 var opml=document.getElementById('setOpmlURL').value;
 if (opml!='') url+='&o='+opml;
 //var css=document.getElementById('setCSSURL').value;
 //if (css!='') url+='&css='+css;
 window.location=url;//open in this window
}

function addEvent(obj, evType, fn, useCapture){
  if (obj.addEventListener){
    obj.addEventListener(evType, fn, useCapture);
    return true;
  } else if (obj.attachEvent){
    var r = obj.attachEvent("on"+evType, fn);
    return r;
  } else {
    alert("Handler could not be attached");
  }
}

var deliPostURLHack;

function add2Delicious(url){
 var root = document.getElementById('bookmark');
 for (;root.childNodes.length>0;) root.removeChild(root.firstChild);
// url=thisEngineRoot+url;
 deliPostURLHack=url;
 var ds=document.createElement('span');
 ds.setAttribute('id','add2delicious');
 var img=document.createElement('img');
 img.setAttribute('src', 'http://blogs.open.ac.uk/Maths/ajh59/delicious.gif');
 img.setAttribute('width','15px;'); img.setAttribute('height','15px;');img.setAttribute('alt','delicious logo');
 ds.appendChild(img);
 var a=document.createElement('a');
 a.setAttribute('href','http://del.icio.us/post');
 addEvent(a,'click',openDeliWin,false);
 var t=document.createTextNode('+2 delicious');
 a.appendChild(t);
 ds.appendChild(a);
 root.appendChild(ds);
}
function openDeliWin(e){
 e.preventDefault();
 window.open('http://del.icio.us/post?v=4&noui&jump=close&url='+encodeURIComponent(deliPostURLHack)+'&title=Bookmarked%20from%20StringLE:&tags=usr:searchfeedr', 'delicious','toolbar=no,width=700,height=400');
 return false;
}

function bookmarkStringleConfig(){
 var configURL=document.getElementById('stringleLink').getAttribute('href');
 window.open('http://del.icio.us/post?v=4&noui&jump=close&url='+encodeURIComponent(configURL)+'&title=Bookmarked%20from%20StringLE:&tags=usr:searchfeedr', 'delicious','toolbar=no,width=700,height=400');
}

function initStringle(){
 
 <?php
  $arg='?';
  if ($_GET['s']) {$arg="?s=".$_GET['s'];$s=$_GET['s'];} else {$arg='';$s="http://www.open.ac.uk";};
  if ($_GET['o']) $arg.="&o=".$_GET['o'];
  if ($_GET['t']) $arg.="&t=".$_GET['t'];
  if ($_GET['css']) $arg.="&css=".$_GET['css'];
  echo "document.getElementById('webURL').value='".$s."';";
  echo "setLink('http://ouseful.open.ac.uk/stringle2.php".$arg."');";
  echo "document.getElementById('setPageURL').value='".$s."';";
  echo "add2Delicious('".$s."');";
 ?>
}
</script>

<!-- horrible hack -->
<style type='text/css'>
#config {display:block;}
#configPanel img {border:0}
</style>


</head>
<body>

<div id='pageContainer'>
 <div id='centrePanel'>
  <div id="toolMenu">
   <div id='tools'>
    <?php if ($_GET['t']!="") echo "<!--"; ?>
    <ul id="toolList">
     <li><a href="javascript:setToolURL('http://ouseful.open.ac.uk/searchfeedr')">searchfeedr</a></li>
     <li><a href="javascript:setToolURL('http://www.geesee.com/sys/geesee.ashx?chatid=932')">Chat</a></li>
     <li><a href="javascript:setToolURL('http://docs.google.com/')">Docs</a></li>
     <li><a href="javascript:setToolURL('http://gliffy.com')">Drawing</a></li>
     <li><a href="javascript:setToolURL('http://stringle.pbwiki.com/')">Wiki</a>/<a style="text-decoration:none" href="javascript:alert('Password: StrinGLE')">*</a></li>
     <li><a href="javascript:setToolURL('http://thinkature.com/workspace/psychemedia/stringle')">Whiteboard</a>/<a style="text-decoration:none" href="javascript:alert('Request ID by emailing tony.hirst@gmail.com')">*</a></li>
     <li><a href="javascript:setToolURL('http://www.aardvarkmap.net/')">Map</a></li>
     <li><a href="javascript:setToolURL('http://www.jumpcut.com/')">Video</a></li>
     <li><a href="javascript:setToolURL('http://www.opmlmanager.com/')">OPML Editor</a></li>
    </ul>
    <?php if ($_GET['t']!="") echo "-->"; ?>
   </div> <!-- tools -->

   <div id="webURL"><input type="text" size='20' id='webURL' <?php if ($_GET['s']) echo 'value="'.$_GET['s'].'"' ?> /> <input type="button" value="Go" onClick='setWebURL()' />
    <span id="bookmark"></span>
   </div> <!-- webURL -->
  </div> <!-- toolMenu -->
  <div id="tabberPanel" class="tabber">
   <div class="tabbertab" title="web">
    <iframe id="ousefulOL" name="ousefulOL" <?php $s = $_GET['s'] ? $_GET['s'] : 'http://www.open.ac.uk'; echo 'src="'.$s.'"'; ?> ></iframe>
   </div> <!-- tabbertab -->
   <div class="tabbertab" title="tools">
    <iframe id="toolsFrame" name='toolsFrame' src=""></iframe>
   </div><!-- tabbertab -->
  </div><!-- tabberPanel -->
 </div><!-- centrePanel -->

 <div id='navigation'>
  <div id='grazrPanel'>
   <a href="http://grazr.com/gzpanel.html?toolbar=off&file=<?php $o = $_GET['o'] ? $_GET['o'] : 'http://www.opmlmanager.com/opml/stringle.opml'; echo $o ?>" target="gz"><img src="http://grazr.com/images/grazrbadge.png" border="0"></a>
   <script defer="defer" type="text/javascript" src="http://grazr.com/gzloader.js?theme=gloss_silver&toolbar=off&linktarget=ousefulOL&file=<?php $o = $_GET['o'] ? $_GET['o'] : 'http://www.opmlmanager.com/opml/stringle.opml'; echo $o ?>"></script>
  </div><!-- grazrPanel -->
  <div id='configPanel'>
   <a id="stringleLink" <?php $url="http://ouseful.open.ac.uk/stringle2.php?";echo "href='".$url."'";?>>Link to this page</a>
   <a href="javascript:bookmarkStringleConfig()"><img src="http://blogs.open.ac.uk/Maths/ajh59/delicious.gif" /></a>
   <br />
  <!-- <a href="javascript:configure();">Configure StrinGLE</a>-->
   <form id="config">
    <label for="">OPML URL:<br />
    <input id='setOpmlURL' type="text" size="29" <?php $o = $_GET['o'] ? $_GET['o'] : $o; echo 'value="'.$o.'"'; ?> /></label><br />
    <label for="">First Page URL:<br />
    <input id='setPageURL' type="text" size="29" <?php $s = $_GET['s'] ? $_GET['s'] : $s; echo 'value="'.$s.'"'; ?> /></label><br />
    <label for="">delicious user/tag (Tools menu):<br />
    <input id='setDeliToolsId' type="text" size="29" <?php $t = $_GET['t'] ? $_GET['t'] : $t; echo 'value="'.$t.'"'; ?> /></label><br />
 <!--   <label for="">CSS Stylesheet URL:<br />
    <input id='setCSSURL' type="text" size="19" <?php $c = $_GET['css'] ? $_GET['css'] : $c; echo 'value="'.$c.'"'; ?> /></label><br />
  -->  <input value="set URL(s)" type="button" onClick="setWebURLlocation();"><br />
   </form><br />
   <!--<a id='stringleLink' href="">Link to new configuration</a>-->
  </div><!-- configPanel -->
 <!-- <div id='wikiAd'>
   <a href="http://stringle.pbwiki.com/" target='toolsFrame'><img border="0" src="http://stringle.pbwiki.com/badge.php" /></a>
  </div>-->
  <!-- wikiAd -->
  <!--<div id='widgetPanel'>
   <script type="text/javascript" <?php $w = $_GET['w'] ? $_GET['w'] : 'http://widgetserver.com/syndication/subscriber/InsertPanel.js?panelId=5d3d8a00-338b-481f-b626-6b6507cbed89'; echo 'src="'.$w.'"'; ?> ></script>
  </div>--><!-- widgetPanel -->
 </div><!-- navigation -->
</div><!-- pageContainer -->
<script type="text/javascript">initStringle();</script>
 <?php if ($_GET['t']=="") echo "<!--"; ?>
 <script type="text/javascript">
    function showImage(img){ return (function(){ img.style.display='inline'; }) }
 
 function showTools(Delicious){
    var label;
    var ul = document.createElement('ul');
    ul.setAttribute('id','toolList');
    for (var i=0, post; post = Delicious[i]; i++) {
        label='';
        var li = document.createElement('li')
        var a = document.createElement('a')
        a.style.marginLeft = '20px'
        var img = document.createElement('img')
        img.style.position = 'absolute'
        img.style.display = 'none'
        img.height = img.width = 16
        img.src = post.u.split('/').splice(0,3).join('/')+'/favicon.ico'
        img.onload = showImage(img);
        a.setAttribute('href', "javascript:setToolURL('"+post.u+"')");
        var label; var tag;
        for (j=0;j<post.t.length;j++){
         tag=post.t[j];
         if (tag.indexOf('stringle:')==0) if (tag!='stringle:tool'){
          label=tag.split(':')[1];
          break;
         }
        }
        if (label=='') label=post.d;
        a.appendChild(document.createTextNode(label));
        li.appendChild(img)
        li.appendChild(a)
        ul.appendChild(li)
    }
    document.getElementById('tools').appendChild(ul)
 }
</script>

<script type="text/javascript" 
        <?php if ($_GET['t']!="") {$t=$_GET['t'];if (strstr($t,'/')) $t.='+'; else $t.='/'; echo "src='http://del.icio.us/feeds/json/".$t."stringle:tool?count=20&callback=showTools'";} ?>></script>
 <?php if ($_GET['t']=="") echo "-->"; ?>
 
 <script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-571814-2";
urchinTracker();
</script>

</body>
</html>

